<template>
  <a-modal :width="1000" v-model:visible="showLogDialog" :footer="false" title="分时策略日志" title-align="start" :mask-closable="false" @cancel="closedDialog">
    <a-form :model="searchVal" layout="inline">
      <a-form-item hide-label>
        <a-select style="width: 120px" v-model="searchVal.userId" placeholder="操作人" @change="getTableList">
          <a-option v-for="user in userList" :key="user.value" :value="user.value" :label="user.label" />
        </a-select>
      </a-form-item>
      <a-form-item hide-label>
        <a-range-picker v-model="searchVal.times" style="width: 260px" @change="getTableList" />
      </a-form-item>
    </a-form>
    <div class="table-model-wrap" style="margin-top: 20px">
      <a-table size="mini" :data="tableList" :scroll="{ y: 'calc(84vh - 160px)' }" :bordered="false" class="table-two-line table-model" :pagination="false">
        <template #columns>
          <a-table-column title="模板名称" :width="130">
            <template #cell>
              <p>AAAAAAAA</p>
            </template>
          </a-table-column>
          <a-table-column title="策略类型" :width="90">
            <template #cell>
              <p>分时调整预算</p>
            </template>
          </a-table-column>
          <a-table-column title="有效期" :width="130">
            <template #cell>
              <p>一直有效</p>
            </template>
          </a-table-column>
          <a-table-column title="调整记录">
            <template #cell>
              <p>每天 13:00 ~ 20:00 按百分比提高 10%，最高调整到 2</p>
            </template>
          </a-table-column>
          <a-table-column title="操作时间" :width="140">
            <template #cell>
              <p>2023-07-24 19:42:19</p>
            </template>
          </a-table-column>
          <a-table-column title="事件" :width="80">
            <template #cell>
              <p>新增策略</p>
            </template>
          </a-table-column>
          <a-table-column title="操作人" :width="70">
            <template #cell>
              <p>李四</p>
            </template>
          </a-table-column>
        </template>
      </a-table>
    </div>
  </a-modal>
</template>
<script lang="ts" setup>
  import { ref, onMounted, PropType } from 'vue'
  const emit = defineEmits(['closed', 'success'])
  const props = defineProps({
    isShow: {
      type: Boolean,
      default: false,
    },
    userList: {
      type: Array as PropType<Array<any>>,
      default: () => [],
    },
  })
  onMounted(async () => {
    getTableList()
  })

  const showLogDialog = ref(props.isShow)
  const searchVal = ref<any>({})
  const tableList = ref<Array<any>>([])

  //产品列表数据
  async function getTableList() {
    tableList.value = [{}, {}]
  }
  // 关闭
  function closedDialog() {
    showLogDialog.value = false
    emit('closed')
  }
</script>
